<!-- 联系我们 -->
<template>
	<view class="ContactUs">
		<view class="contac-backs poa"></view>
		<view class="contact-us dis-cen por">
			<image class="text-img" src="@/static/img/tjkf.png" mode="widthFix"></image>
			<image class="service" src="@/static/img/kf.png" mode="widthFix"></image>
		</view>
		<view class="contact radius12 f-background margin-bottom-16">
			<image class="cing-left" src="@/static/img/xing.png" mode=""></image>
			<image class="cing-right" src="@/static/img/xing.png" mode=""></image>
			<view class="code">
				<image show-menu-by-longpress class="width-height100"  :src="userInfo.customerQrcode" mode=""></image>
			</view>
			<view class="font-weight-400 size-30 text-align color9e5b">长按识别二维码</view>
		</view>
		<u-button type="primary" :customStyle="{width: '100%',height: '108rpx',margin: 0,borderRadius: '12rpx'}"
			color="#ffffff" openType="contact">
			<image class="primary-img" src="@/static/icon/ej.png" mode=""></image>
			<text class="font-weight-500 size-28 color9e5b">在线客服</text>
		</u-button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {}
			}
		},
		onShow() {
			this.userInfo = uni.getStorageSync('userInfo')
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	.ContactUs {
		padding: 0 16rpx;

		.cing-left,
		.cing-right {
			width: 64rpx;
			height: 65rpx;
			position: absolute;
			z-index: 100;
		}

		.cing-left {
			bottom: 132rpx;
			left: 80rpx;
		}

		.cing-right {
			top: 88rpx;
			right: 78rpx;
		}

		.contac-backs {
			width: 100vw;
			height: 660rpx;
			left: 0;
			top: 0;
			background: linear-gradient( 177deg, #FF3636 18%, rgba(255,54,54,0) 100%);;
		}

		.color9e5b {
			color: #9E5B5B;
		}

		.primary-img {
			width: 38rpx;
			height: 36rpx;
			margin-right: 16rpx;
		}

		.contact-us {
			padding: 0 28rpx 0 88rpx;

			.text-img {
				width: 264rpx;
				height: 120rpx;
			}

			.service {
				width: 282rpx;
				height: 218rpx;
			}
		}

		.contact {
			margin-top: -32rpx;
			position: relative;
			padding-bottom: 50rpx;

			.code {
				width: 378rpx;
				height: 372rpx;
				border: 2px solid #EDBCBC;
				padding: 30rpx;
				border-radius: 36rpx;
				margin: 48rpx auto 20rpx;
				box-sizing: border-box;
			}
		}
	}
</style>